<!--登录页面 -->
<template>
  <div class="wrap login-content">

    <el-container>
      <el-header style="text-align:center;"></el-header>
      <el-main>
        <el-row :gutter="10">
          <el-col :md="8"
                  :lg="8"
                  :xl="9">
            <div class="grid-content bg-purple">&nbsp;</div>
          </el-col>
          <el-col :md="9"
                  :lg="8"
                  :xl="6">
            <div class="grid-content bg-purple-light">
              <el-card class="box-card">

                <div class="login">

                  <el-form :model="ruleForm"
                           :rules="rules"
                           ref="ruleForm"
                           label-width="100px"
                           class="demo-ruleForm">

                    <el-form-item label="租户"
                                  prop="region">
                      <el-cascader v-model="ruleForm.region"
                                   :options="options"
                                   @change="handleChange()"></el-cascader>
                    </el-form-item>

                    <el-form-item label="账号"
                                  prop="name">
                      <el-input v-model="ruleForm.name"></el-input>
                    </el-form-item>

                    <el-form-item>
                      <el-button type="primary"
                                 @click="login()"
                                 style="width:50%">登录</el-button>
                    </el-form-item>

                  </el-form>
                </div>

              </el-card>

            </div>
          </el-col>
          <!-- <el-col :xl="1">
            <div class="grid-content bg-purple">&nbsp;</div>
          </el-col> -->
        </el-row>
      </el-main>
      <el-footer></el-footer>
    </el-container>

  </div>
</template>

<style>
</style>

<script>
import { setToken } from '@/utils/auth'
import cascaderData from '@/data/cascaderData'

export default {
  name: 'Login',
  components: {},
  data() {
    return {
      options: cascaderData,
      input: '',
      pwad: '',
      app_name: this.appConfig.app_name,
      ruleForm: {
        name: '',
        region: '',
      },
      rules: {
        name: [
          { required: true, message: '请输入活动名称', trigger: 'blur' },
          { min: 3, max: 5, message: '长度在 3 到 5 个字符', trigger: 'blur' },
        ],
        region: [
          { required: true, message: '请选择活动区域', trigger: 'change' },
        ],
      },
    }
  },
  mounted() {
    document.title = '登录' + '—' + this.appConfig.app_name
  },
  methods: {
    login() {
      setToken(this.appConfig.author)
      const redirectPath = this.$route.query.redirect
      if (redirectPath) {
        this.$router.push(redirectPath)
      } else {
        this.$router.push('/')
      }
    },
    handleChange() {},
  },
}
</script>